
<!DOCTYPE html>
<html lang="cn">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>订单-确认订单</title>
    <link href="/static/myweb/public/img/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <link href="/static/myweb/public/img/favicon.ico" rel="icon" type="image/x-icon">
    <!-- Bootstrap -->
    <link href="/static/myweb/public/css/bootstrap.min.css" rel="stylesheet">
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="/static/myweb/public/js/jquery-1.12.4.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="/static/myweb/public/js/bootstrap.min.js"></script>

    <link rel="stylesheet" type="text/css" href="/static/myweb/public/css/global.css">
    <link rel="stylesheet" type="text/css" href="/static/myweb/public/css/app.css">
    
    <link rel="stylesheet" type="text/css" href="/static/myweb/public/css/cart.css">
    <link rel="stylesheet" type="text/css" href="/static/myweb/public/css/cart-app.css">
    
    <script type="text/javascript" src="/static/myweb/public/js/rem.js"></script>
    <script type="text/javascript" src="/static/myweb/public/js/topNav.js"></script>
</head>
  
<body class="cart-app">
    <!-- 导航 -->
    <div class="layout-header" id="scroll-wrap">
        <nav class="navbar navbar-default header hidden-xs hidden-sm">
            <div class="container clearfix">
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    <div class="layout-header-logo navbar-left">
                        <a target="_blank" href="./index.html" class="layout-header-logo-link" alt="魅族科技">
                            <img src="/static/myweb/public/img/logo.png">
                        </a>
                    </div>
                    <div class="navbar-left">
                        <ol class="breadcrumb">
                            <li >购物车</li>
                            <li class="active">确认订单</li>
                            <li>在线支付</li>
                            <li>完成 </li>
                        </ol>
                    </div>
                </div>
            </div>
        </nav>
       
    </div>
    <!-- 导航 E-->
    <!-- 主内容区域 -->
    <div class="mainbody cart">
        <div class="container">
            <!-- 购物车详情头 -->
            <table class="cart-header">
                <tbody>
                    <tr>
                        <td class="cart-col-select col-md-3 col-xs-3 col-sm-3">
                           商品图片
                        </td>
                        <td class="cart-col-name col-md-3 hidden-xs hidden-sm">商品</td>
                        <td class="cart-col-price col-md-2 hidden-xs hidden-sm">单价(元)</td>
                        <td class="cart-col-number col-md-2 hidden-xs hidden-sm">数量</td>
                        <td class="cart-col-total col-md-1 hidden-xs hidden-sm">小计(元)</td>
                    </tr>
                </tbody>
            </table><!-- 购物车详情头 E-->
            
            <!-- 购物清单信息列表 -->
            <div class="cart-merchant-list">
                <div class="cart-merchant">
                    <table class="cart-merchant-body">
                        <tbody>
                        {% for v in goods %}
                            <tr class="cart-product" id="pro5">
                                <td class="cart-col-select col-md-3 col-xs-4 col-sm-4">  
                                    <a href="meilanx.html" class="cart-product-link" target="_blank">
                                        <img src="/static/goods/{{ v.picname }}" class="cart-product-img" alt="魅蓝 X">
                                    </a>
                                </td>
                                <td class="cart-col-name col-md-3 col-xs-8 col-sm-8">
                                    <a href="meilanx.html" class="cart-product-link" target="_blank">
                                      <span class="cart-product-desc">{{ v.title }}</span>
                                    </a>
                                    
                                </td>
                                <td class="cart-col-price col-md-2 hidden-xs hidden-sm">
                                    <p>
                                        <span class="cart-product-price">{{ v.price }}</span>
                                    </p>
                                </td>
                                <td class="cart-col-number col-md-2 hidden-xs hidden-sm">
                                    <div class="cart-product-number-adder">
                                        <p class="cart-product-number-max show"></p>
                                        <p>{{ v.num }}</p>
                                    </div>
                                </td>
                                <td class="cart-col-total col-md-1 hidden-xs hidden-sm">
                                    <span class="cart-product-price total">{% widthratio v.num 1 v.price %}</span>
                                </td>
                            </tr>
                        {% endfor %}
                   
                        </tbody>
                    </table>
                </div>
            </div><!-- 购物清单信息列表 E-->
        </div>
        <br>
        <form action="{% url 'ordercreate' %}" method="post">
            {% csrf_token %}
        <div class="container" >
            <div class="row">
                <div class="col-md-10"  style="background:#f5f5f5">
                    
                  
                        收货人: <input type="text" name="uname">
                        收货地址:<input type="text" name="address">
                        收货电话:<input type="text" name="phone">
                        邮编:<input type="text" name="pcode">
                        <input type="hidden" name="total" value="{{ total }}">
                    
                </div>       
            </div>
        </div>
        <br>
        <!-- 结算详情 -->
        <div class="cart-footer" id="cartFooter">
            <div class="container">

               <div class="cart-footer-left col-md-6 col-xs-4 col-sm-4">
                
                  
                   <!-- <span class="cart-remove-selected" id="removeSelected">删除选中的商品</span> -->
                   <span class="cart-footer-count">
                        共
                        <span class="cart-footer-num" id="totalCount">{{ subnum }}</span>
                        件商品
                   </span>
                </div>
                <div class="cart-footer-right col-md-5 col-md-offset-1 col-sm-offset-2 col-xs-8 col-sm-6">
                    <span class="cart-footer-sum">
                        <span class="cart-footer-text">已优惠</span>
                        <span class="cart-footer-num red" id="totalDiscount">0.00</span>
                        <span class="cart-footer-text">元， 合计(不含运费)：</span>
                        <span class="cart-footer-total" id="totalPrice">{{ total }}</span>
                    </span>
                    <button class="mz-btn success" id="cartSubmit">提交订单</button>
                </div>
            </div>
        </div><!-- 结算详情 E-->
        </form>
    </div>
    <!-- 主内容区域 E-->
    
</body>

</html>